<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品列表</title>
    <link rel="stylesheet" href="/lib/layui/css/layui.css"/>
    <link rel="stylesheet" href="/css/shop-list.css"/>
    <link rel="stylesheet" href="/css/commen.css"/>
    <link rel="stylesheet" href="/css/home.css"/>
    <style>
        .box{
            width:160px;
            height:160px;
            max-width: 160px;
            overflow: hidden;
            position:  relative;
            /*background-color: #000000a6;*/
            margin-left: 37.5px;
        }
        .box img{
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            height: 160px;
        }
    </style>
</head>
<body>
<div class="commen_top">
    <!--top-->
    <!--top-->
    <div class="commen_top">
        <div class="content clearfix">
            <div class="pull_left mall_left" id="homePage">诚惠欢迎您!</div>
            <div class="pull_right">
                <div class="top_nav pull_left">
                    <a id="myCenter">我的诚惠</a>
                    <a class="phone_yp">手机诚惠</a>
                    <a href="" id="">帮助中心</a>
                </div>
                <div class="top_login pull_left">
                    <a id="login">登录</a>
                    <a id="register">注册</a>
                    <span id="signName" style="display: none;cursor: pointer;"></span>
                    <a id="signOut" style="display: none">退出</a>
                </div>
            </div>
        </div>
    </div>
    <!--logo-->
    <div class="logo_column pull_center">
        <div class="content pull_center clearfix">
            <div class="pull_left logo_left" id="headPortrait">
                <img src=" /img/logo.png" width="100" height="125" />
            </div>
            <div class="search pull_left">
                <div class="search_box clearfix">
                    <input placeholder="圣诞开趴 抢圣诞限量好礼" id="searchInput"/>
                    <button id="btn_search">搜索</button>
                </div>
            </div>
            <a class="pull_right shop_car" id="shopCar">
                <span class="icon"><img src=" /img/shop_car.png"></span>
                <span>我的购物车</span>
            </a>
        </div>
    </div>
<!--商品类型-->
<div class="content clearfix">
    <div>
        <p class="productTypeText">耳机</p>
    </div>
    <div class="productType">
        <!--<img src="../img/good_list_01.png" class="productTypeImg active">-->
        <!--<img src="../img/good_list_02.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_03.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_04.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_11.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_13.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_15.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_17.png" class="productTypeImg">-->
        <!--<img src="../img/good_list_19.png" class="productTypeImg">-->
    </div>
</div>
<!--商品分类-->
<div class="classify">
    <div class="classifyContent">
        <div class="classifyType" id="classifyType">
            <div id="lastCateList"></div>
            <div id="specList"></div>
        </div>
        <!--搜索排序-->
        <div class="seek" id="tab">
            <div class="seeklist active" attr="0" style="border-left: 1px solid #acacac;">综合排序<span class="icon-arrowdown"></span></div>
            <div class="seeklist" attr="1">销量<span class="icon-arrowdown"></span></div>
            <div class="seeklist" attr="2">价格<span class="icon-arrowdown"></span></div>
            <div class="seeklist" attr="3">上架时间<span class="icon-arrowdown"></span></div>

        </div>
    </div>
</div>
<!--商品列表-->
<div class="shop">
    <div class="shopContent ">
        <div class="shopList" id="shopList">
            <div class="list_right">
                <div class="product_list" id="productList">
                    <!--<div class="product_style">-->
                        <!--<img src="/img/Home_12.png" class="productImg" style="width: 160px">-->
                        <!--<p class="productName">小米圈铁耳机Pro</p>-->
                        <!--<div>¥149.00</div>-->
                        <!--<div class="mask">-->
                            <!--<button>立即购买</button>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="product_style">-->
                        <!--<img src="/img/Home_14.png" class="productImg" style="width: 160px">-->
                        <!--<p class="productName">Apple MD818FE/A Lightn ing to USB iPhone/iPad</p>-->
                        <!--<div>¥149.00</div>-->
                        <!--<div class="mask">-->
                            <!--<button>立即购买</button>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="product_style">-->
                        <!--<img src="/img/Home_14.png" class="productImg" style="width: 160px">-->
                        <!--<p>飞利浦 DLP3018 双USB 折叠式 电源适配器/手机充电器/充电</p>-->
                        <!--<div>¥149.00</div>-->
                        <!--<div class="mask">-->
                            <!--<button>立即购买</button>-->
                        <!--</div>-->
                    <!--</div>-->
                    <!--<div class="product_style">-->
                        <!--<img src="/img/Home_13.png" class="productImg" style="width: 160px">-->
                        <!--<p class="productName">罗马仕（ROMOSS）SENSE4超智能 移动电源/充电宝10400Amh3333333</p>-->
                        <!--<div>¥155.00</div>-->
                        <!--<div class="mask">-->
                            <!--<button>立即购买</button>-->
                        <!--</div>-->
                    <!--</div>-->

                </div>
                </div>


        </div>
    </div>


</div>
<div class="shopping_empty clearfix content" id="noshopCar" style="display: none" >
    <div class="pull_left"><img src="/img/noProduct.png"></div>
    <div class="pull_left tips">
        <!--<p>～暂无此类商品~</p>-->

    </div>
</div>
<div id="pageList" style="text-align: center;"></div>
    <div class="homeBottom">
        京ICP证080275号
    </div>
</div>
<script src="/lib/jquery-1.9.1.min.js"></script>
<script src="/lib/common.js"></script>
<script src="/lib/expand.js"></script>
<script src="/lib/layui/layui.js"></script>
<script src="/js/shop-list.js"></script>

</body>
</html>